<!-- 发件人进口商派送信息 -->
<template>
  <el-row :gutter="10" class="flex flex-wrap">
    <el-col :sm="8" :md="4" :lg="4">
      <el-card>
        <div slot="header" class="clearfix relative">
          <span class="title-icon">发件人信息</span>
          <!-- <el-button
            type="success"
            size="mini"
            class="header-save-btn"
            @click="changeChannelInfo"
          >
            {{ isChangeChannelInfo ? "保存" : "编辑" }}
          </el-button> -->
        </div>

        <el-form
          size="mini"
          label-position="left"
          label-width="78px"
          class="main-text"
        >
          <el-form-item prop="senderCompany">
            <div slot="label">发件人：</div>
            <span>{{ senderInfo.senderCompany }}</span>
          </el-form-item>
          <el-form-item prop="senderLinkMan">
            <div slot="label">联系人：</div>
            <span>{{ senderInfo.senderLinkMan }}</span>
          </el-form-item>

          <el-form-item prop="senderPhone">
            <div slot="label">电话：</div>
            <span>{{ senderInfo.senderPhone }}</span>
          </el-form-item>

          <el-form-item prop="senderAdress">
            <div slot="label">详细地址：</div>
            <span>{{ senderInfo.senderAdress }}</span>
          </el-form-item>
        </el-form>
      </el-card>
    </el-col>
    <!-- 进口商信息 -->
    <el-col :sm="8" :md="4" :lg="6">
      <el-card>
        <div slot="header" class="clearfix relative">
          <span class="title-icon">进口商信息</span>
        </div>

        <el-row class="main-text form-item-text">
          <el-col :span="4">
            <span>公司名：</span>
          </el-col>
          <el-col :span="8">
            <span>{{ importInfo.importerCompanyName }}</span>
          </el-col>
          <el-col :span="4">
            <span>联系人：</span>
          </el-col>
          <el-col :span="8">
            <span>{{ importInfo.importerLinkMan }}</span>
          </el-col>
        </el-row>
        <el-row class="main-text form-item-text">
          <el-col :span="3">
            <span>电话：</span>
          </el-col>
          <el-col :span="9">
            <span>{{ importInfo.importerPhone }}</span>
          </el-col>
          <el-col :span="3">
            <span>邮编：</span>
          </el-col>
          <el-col :span="9">
            <span>{{ importInfo.importerZipCode }}</span>
          </el-col>
        </el-row>

        <el-row class="main-text form-item-text">
          <el-col :span="3">
            <span>VAT：</span>
          </el-col>
          <el-col :span="9">
            <span>{{ importInfo.vat }}</span>
          </el-col>
          <el-col :span="3">
            <span>EOTI：</span>
          </el-col>
          <el-col :span="0">
            <span>{{ importInfo.eori }}</span>
          </el-col>
        </el-row>
        <el-row class="main-text form-item-text">
          <el-col :span="8">
            <span>进口商地址：</span>
          </el-col>
          <el-col :span="16">
            <span>{{ importInfo.importerAddress }}</span>
          </el-col>
        </el-row>
      </el-card>
    </el-col>

    <!-- 订舱信息 -->
    <el-col :sm="24" :md="12" :lg="14" v-if="verifyShow.extDeliver">
      <el-card>
        <div slot="header" class="clearfix relative">
          <span class="title-icon">派送信息</span>
          <!-- <el-button
            type="success"
            size="mini"
            class="header-save-btn"
            @click="changeStockInfo"
          >
            {{ isChangeProtInfo ? "保存" : "编辑" }}
          </el-button> -->
        </div>
        <el-form
          size="mini"
          label-position="left"
          label-width="90px"
          class="main-text"
        >
          <el-row :gutter="10">
            <el-col :md="6" :lg="6">
              <el-form-item prop="purposeWarehouseType">
                <div slot="label">目的仓类型：</div>
                <span>{{
                  initOptionsData.stockTypeMap[
                    waybillRelevance.purposeWarehouseType
                  ]
                }}</span>
              </el-form-item>
            </el-col>
            <el-col :md="6" :lg="6">
              <el-form-item prop="dispatchAddressCode">
                <div slot="label">仓库代码：</div>
                <span>{{ waybillRelevance.dispatchAddressCode }}</span>
              </el-form-item>
            </el-col>
            <el-col :md="12" :lg="12">
              <el-form-item prop="dispatcher">
                <div slot="label">公司名/个人：</div>
                <span>{{ waybillRelevance.dispatcher }}</span>
              </el-form-item>
            </el-col>
            <el-col :md="6" :lg="6">
              <el-form-item prop="dispatchLinkMan">
                <div slot="label">联系人：</div>
                <span>{{ waybillRelevance.dispatchLinkMan }}</span>
              </el-form-item>
            </el-col>
            <el-col :md="6" :lg="6">
              <el-form-item prop="dispatchPhone">
                <div slot="label">联系电话：</div>
                <span>{{ waybillRelevance.dispatchPhone }}</span>
              </el-form-item>
            </el-col>
            <el-col :md="12" :lg="12">
              <el-form-item prop="dispatchProvince">
                <div slot="label">州/省：</div>
                <span>{{ waybillRelevance.dispatchProvince }}</span>
              </el-form-item>
            </el-col>
            <el-col :md="6" :lg="6">
              <el-form-item prop="dispatchCity">
                <div slot="label">城市：</div>
                <span>{{ waybillRelevance.dispatchCity }}</span>
              </el-form-item>
            </el-col>
            <el-col :md="12" :lg="12">
              <el-form-item prop="dispatchZipCode">
                <div slot="label">邮编：</div>
                <span>{{ waybillRelevance.dispatchZipCode }}</span>
              </el-form-item>
            </el-col>
            <el-col :md="24" :lg="24">
              <el-form-item prop="dispatchAddress">
                <div slot="label">详细地址：</div>
                <span>{{ waybillRelevance.dispatchAddress }}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-card>
    </el-col>
  </el-row>
</template>

<script>
import { ajax } from "@/store/yg/common/utils";
import * as constant from "@/store/yg/common/constant";
import axios from "axios";

export default {
  props: {
    verifyShow: {
      type: Object,
      default: function() {
        return {};
      }
    },
    pageType: {
      type: String,
      required: true
    },
    waybillData: {},
    initOptionsData: {}
  },
  data() {
    return {
      senderInfo: {
        // id: 0,
        // senderCompany: "Jack", // 发件人
        // senderLinkMan: "Jack", // 联系人：
        // senderPhone: 13544446666, // 联系电话：
        // senderAdress: "Jack" // 详细地址：
      },
      importInfo: {
        // id: 0,
        // eoriIsCertified: 1, //认证
        // isVatAndEori: 1, //自有VAT/EORI
        // importerCompanyName: 1, //进口商公司名：
        // importerAddress: 1, //进口商详细地址：
        // importerZipCode: 1, //邮编
        // importerLinkMan: 1, // 联系人
        // importerPhone: 1, // 进口商联系人电话：
        // vat: 1,
        // eori: 1
      },
      waybillRelevance: {
        // isFba: 0,
        // dispatchAddressCode: "",
        // dispatcher: "",
        // dispatchLinkMan: "",
        // dispatchPhone: "",
        // dispatchProvince: "",
        // dispatchCity: "",
        // dispatchZipCode: "",
        // dispatchAddress: ""
      },
      waybillId: 0,
      shippingway: 0,
      isChangeChannelInfo: false,
      isChangeOutStockInfo: false,
      isChangeProtInfo: false,

      outStockInfo: {},
      isNotOptions: {
        1: "是",
        0: "否"
      },

      protInfo: {},
      //渠道下拉
      stockChannelOptions: {},
      //国家下拉
      countryOptions: {},
      //港口下拉
      configPortOptions: {},
      //航空公司下拉
      airlineOptions: {},
      //船公司
      configShipOptions: {},
      //服务商
      serviceCompanyOptions: {},
      //币种
      currencyOptions: {},
      // 用户下拉
      userOptions: {},
      pickerOptions: {
        // disabledDate(time) {
        //   return time.getTime() > Date.now();
        // },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            }
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            }
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            }
          }
        ]
      }
    };
  },
  mounted() {
    this.waybillId = this.$route.query.waybillId;
    this.shippingway = this.$route.query.shippingway;

    var constProtInfo = {};
    constProtInfo.id = this.waybillData.id;
    constProtInfo.masterNumber = this.waybillData.masterNumber;
    constProtInfo.estimatedDepartureTime = this.waybillData.estimatedDepartureTime;
    constProtInfo.estimatedArrivalTime = this.waybillData.estimatedArrivalTime;
    constProtInfo.serviceCompanyId = this.waybillData.serviceCompanyId;
    constProtInfo.customsClearanceAgent = this.waybillData.customsClearanceAgent;
    constProtInfo.afterSendServicer = this.waybillData.afterSendServicer;
    constProtInfo.shipmentPort = this.waybillData.shipmentPort;
    constProtInfo.departurePortInspectionTime = this.waybillData.departurePortInspectionTime;
    constProtInfo.departurePortInspectionReason = this.waybillData.departurePortInspectionReason;
    constProtInfo.destinationPort = this.waybillData.destinationPort;
    constProtInfo.arrivalPortInspectionTime = this.waybillData.arrivalPortInspectionTime;
    constProtInfo.arrivalPortInspectionReason = this.waybillData.arrivalPortInspectionReason;
    constProtInfo.transferPort = this.waybillData.transferPort;
    constProtInfo.transferPortInspectionTime = this.waybillData.transferPortInspectionTime;
    constProtInfo.transferPortInspectionReason = this.waybillData.transferPortInspectionReason;
    constProtInfo.shipOrAirlineCompany = this.waybillData.shipOrAirlineCompany;
    constProtInfo.flightNumber = this.waybillData.flightNumber;
    constProtInfo.shipOrAirlineCompany = this.waybillData.shipOrAirlineCompany;
    constProtInfo.bigShip = this.waybillData.bigShip;
    constProtInfo.shipFlights = this.waybillData.shipFlights;
    constProtInfo.shipImo = this.waybillData.shipImo;
    constProtInfo.wharfName = this.waybillData.wharfName;
    constProtInfo.deliveryType = this.waybillData.deliveryType;
    constProtInfo.portOfDestinationWay = this.waybillData.portOfDestinationWay;
    constProtInfo.boardNo = this.waybillData.boardNo;
    constProtInfo.lastFreeDayTime = this.waybillData.lastFreeDayTime;
    constProtInfo.customerRemark = this.waybillData.customerRemark;
    constProtInfo.customerRemark2 = this.waybillData.customerRemark2;
    this.protInfo = constProtInfo;
    //只对部分赋值

    var constChannelInfo = {};
    constChannelInfo.id = this.waybillData.id;
    constChannelInfo.countryId = this.waybillData.countryId;
    constChannelInfo.inStockChannel = this.waybillData.inStockChannel;
    constChannelInfo.isTaxFarming = this.waybillData.isTaxFarming;
    constChannelInfo.customerActualWeight = this.waybillData.customerActualWeight;
    constChannelInfo.customerVolume = this.waybillData.customerVolume;
    constChannelInfo.customerChargedWeight = this.waybillData.customerChargedWeight;
    constChannelInfo.customerTotalPackages = this.waybillData.customerTotalPackages;
    this.channelInfo = constChannelInfo;

    var constStockInfoS = {};
    constStockInfoS.id = this.waybillData.id;
    constStockInfoS.inStockTotalPackages = this.waybillData.inStockTotalPackages;
    constStockInfoS.inStockActualWeight = this.waybillData.inStockActualWeight;
    constStockInfoS.inStockChargedWeight = this.waybillData.inStockChargedWeight;
    constStockInfoS.inStockVolume = this.waybillData.inStockVolume;
    this.senderInfo = constStockInfoS;

    var constOutStockInfo = {};
    constOutStockInfo.id = this.waybillData.id;
    constOutStockInfo.serviceTotalPackages = this.waybillData.serviceTotalPackages;
    constOutStockInfo.serviceActualWeight = this.waybillData.serviceActualWeight;
    constOutStockInfo.serviceChargedWeight = this.waybillData.serviceChargedWeight;
    constOutStockInfo.serviceVolume = this.waybillData.serviceVolume;
    constOutStockInfo.serviceVolumeWeight = this.waybillData.serviceVolumeWeight;
    constOutStockInfo.serviceUnitPrice = this.waybillData.serviceUnitPrice;
    constOutStockInfo.serviceUnitPriceCurrency = this.waybillData.serviceUnitPriceCurrency;
    this.outStockInfo = constOutStockInfo;

    this.waybillRelevance = this.waybillData;
    this.initOptions();
  },
  methods: {
    //初始化下拉
    initOptions() {
      const sources = ["userSource"];
      sources.forEach(bean => {
        var uri = "/api/entry/source?bean=" + bean;
        axios.post(constant.API_SERVER + uri).then(
          response => {
            if (bean === "userSource") {
              this.userOptions = response.data;
            }
          },
          error => {
            console.info(error);
          }
        );
      });
    },

    //修改保存渠道信息
    changeChannelInfo() {
      if (this.isChangeChannelInfo) {
        this.isChangeChannelInfo = false;
        var params = this.channelInfo;
        params["id"] = this.waybillId;
        this.updateWaybillByMap(params);
      } else {
        this.isChangeChannelInfo = true;
      }
    },
    changeOutOfStockInfo() {
      if (this.isChangeOutStockInfo) {
        this.isChangeOutStockInfo = false;
        var params = this.outStockInfo;
        params["id"] = this.waybillId;
        this.updateWaybillByMap(params);
      } else {
        this.isChangeOutStockInfo = true;
      }
    },
    changeStockInfo() {
      if (this.isChangeProtInfo) {
        this.isChangeProtInfo = false;
        var params = this.protInfo;
        params["id"] = this.waybillId;
        this.updateWaybillByMap(params);
      } else {
        this.isChangeProtInfo = true;
      }
    },

    updateWaybillByMap(param) {
      ajax("updateWaybillByMap", param).then(
        res => {
          if (res.code != 200) {
            this.$message.error(res.message);
          } else {
            console.info("更新成功！");
          }
        },
        error => {
          console.log(error);
        }
      );
    }
  }
};
</script>

<style lang="scss" scoped>
.main-text {
  span {
    display: inline-block;
    color: #3f4652;
    line-height: 28px;
    font-size: 12px;
  }
}

.form-item-text {
  span {
    height: 28px;
    margin-bottom: 14px;
  }
}
</style>
